<template>
	<view class="container">
		<view class="avatar-box">
			<image class="avatar" src="/static/logo.png"></image>
			<view class="version-num">V1.6.2</view>
			<view class="update-version">更新</view>
		</view>
		<view class="list-box">
			<view class="item flex-just-between">
				<view class="left">
					<image src="/static/set-icon.png" mode=""></image>
					<text>User Agreement</text>
				</view>
				<uni-icons type="right" :size="24"></uni-icons>
			</view>
			<view class="item flex-just-between">
				<view class="left">
					<image src="/static/star-icon.png" mode=""></image>
					<text>Privacy Policy</text>
				</view>
				<uni-icons type="right" :size="24"></uni-icons>
			</view>
			<view class="item flex-just-between">
				<view class="left">
					<image src="/static/friends-icon.png" mode=""></image>
					<text>Filing information</text>
				</view>
				<uni-icons type="right" :size="24"></uni-icons>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
			}
		},
		methods: {
		}
	}
</script>

<style lang="less" scoped>
	.container{
		padding-top: 74rpx;
		.avatar-box{
			margin-bottom: 80rpx;
			position: relative;
			text-align: center;
			font-size: 28rpx;
			.avatar{
				margin: 0 auto 10rpx;
				display: block;
				width: 168rpx;
				height: 168rpx;
				border-radius: 32rpx;
			}
			.update-version{
				margin: 24rpx auto 0;
				width: 104rpx;
				height: 52rpx;
				line-height: 52rpx;
				background: #52A5F3;
				border-radius: 12rpx;
				color: #fff;
			}
		}
		.list-box{
			margin-top: 80rpx;
			padding: 0 52rpx;
			.item{
				height: 110rpx;
				font-size: 32rpx;
				image{
					margin-right: 30rpx;
					width: 36rpx;
					height: 36rpx;
				}
			}
		}
	}
</style>